<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=us-ascii">
<script src="jquery-1.6.4.min.js"></script>
<script src="jquery.mobile-1.0b3.min.js"></script>
<script src="LoadNewsHome.js" type="text/javascript"></script>
<script type="text/javascript">
	window.onload = loadContent();
</script>
<style type="text/css">
body{
    margin: 2px 2px 0 2px;
}
img {
    border:0;
    vertical-align:middle}
.hotnews{
    float: left;
    width:100%;
    padding:0 0 2% 0;
    margin-bottom: 2%;
    background-color: #fff;
    overflow: hidden;
    border-bottom: dotted 2px #dddddd;    
    /*border:1px solid green;*/
   
}
.hotnews a{
    font-weight:bold;
}
.hotnews .thumb{
    padding: 10px 2% 0.2% 0.6%;
    width:30%;
    max-width: 200px;
    float:left;
}
.hotnews a.title{
    font-weight:bold;
    text-decoration: none;
    font-family: sans-serif;
    font-family: Myriad Pro !important;
    font-size: 110%;
}
.hotnews .desc{
    display:block;
    font-family: sans-serif;
    font-family: Myriad Pro !important;
    margin-top:5px;
    text-align:justify;
}
.new{    
    float: left;
    width: 100%;
    background-color: #fff;
    margin-bottom: 2%;
    border-bottom: dotted 2px #dddddd
    /*border:1px solid yellow;*/ 
}
.newsItems {
    width:100%;    
    margin: 10px;       
    float: left;
    /*border:1px solid red; */  
    
}
.newsItems a.title{
    font-weight:bold;
    font-family: sans-serif;
    font-family: Myriad Pro !important;
    font-size: 80%;
    text-align: center;
    text-decoration: none;
}
.newsItems .thumb{    
    padding-right: 5px;
    float: left;    
    width:20%;
    max-width: 150px;        
    margin: 0 auto;    
    /* box-shadow : -5px 3px 5px #ccc; */
    text-align: center;    
}

.Related{
    float: left;
    width: 100%; 
    padding:0 0 2% 0;
    background-color: #fff;
    border-bottom: dotted 2px #dddddd;
}
.oldNews{
    width: 100%;    
    /* border:1px solid black; */
}
.oldNews a{
    font-weight: bold;
    text-decoration: none;    
    font-family: Myriad Pro;
    font-style: italic;
    font-size: 90%;
    padding: 2% 0 2% 10px;   
}
.main{
    background-color: #2D427B;    
    color: white;
    display: block;
    padding:3px 3px 3px;    
    height:15px;    
    font-family: Myriad Pro !important;
    text-transform:uppercase;
    -moz-border-radius-topleft: 8px ;
    border-top-left-radius: 8px ;
    -moz-border-radius-topright: 8px ;
    border-top-right-radius: 8px ;    
}
</style>
</head>

<body>
    
<div class="hotnews" id="hotnews">
    <span class="main" id="hotnewsMain"> Hot</span>
    <img class="thumb" src="" id="hotnewsImg"/>
    <a class="title" id="hotnewsTitle" href="#"></a>
    <div class="desc" id="hotnewsDesc">
        
    </div>
    
</div>

<div class="new">
    <span class="main"> New</span>
    <div class="newsItems" id="newsItem0">
        <img class="thumb" src="" id="newsItem0Img" />
        <a class="title" id="newsItem0Title" href="#"> </a>
    </div>
    <div class="newsItems" id="newsItem1">
        <img class="thumb" src="" id="newsItem1Img" />
        <a class="title" id="newsItem1Title" href="#"> </a>
    </div>
    <div class="newsItems" id="newsItem2">
        <img class="thumb" src="" id="newsItem2Img" />
        <a class="title" id="newsItem2Title" href="#"> </a>
    </div>
    
</div>


<div class="Related">
    <span class="main"> Others</span>
    <div class="oldNews">
        <a href="#" id="other0"></a>    
    </div>
    <div class="oldNews">
        <a href="#" id="other1"></a>
    </div>
    <div class="oldNews">
        <a href="#" id="other2"></a>
    </div>
</div>
</body>
</html>
